<template>
  <div class="personIndex">
    <ul>
      <a-row v-for="(item, index) in data" :key="index">
        <li class="person-wrapper" v-if="changeStatus(item)">
          <div class="title">{{ item.name }}</div>
          <div class="des">{{ item.des }}</div>
          <a-button @click="goPage(item.routerName, item.key)">{{
            item.button
          }}</a-button>
        </li>
      </a-row>
    </ul>
  </div>
</template>

<script>
import { Row } from "ant-design-vue";
export default {
  name: "index",
  components: {
    aRow: Row
  },
  data() {
    return {
      data: [
        {
          name: "登录密码",
          routerName: "loginPassword",
          des: "定期修改登录密码，可以更加保障您的账号安全",
          button: "修改登录密码"
        },
        {
          name: "支付密码",
          routerName: "payPassword",
          des: "支付密码涉及您的财务安全，请妥善保管",
          button: "设置支付密码"
        },
        {
          key: "bank",
          name: "我的银行账户",
          routerName: "bankCard",
          des: "管理您的银行账户",
          button: "管理账户",
          sign: true
        },
        {
          key: "bank",
          name: "我的银行账户",
          routerName: "bankCard",
          des: "添加银行账号前请先签订,去签订《会员电子协议》",
          button: "去签订",
          sign: false
        }
      ]
    };
  },
  methods: {
    changeStatus(item) {
      if (item.key === "bank") {
        if (this.isSign === item.sign) {
          return true;
        } else {
          return false;
        }
      } else {
        return true;
      }
    },
    goPage(routerName, key) {
      if (key === "bank") {
        if (this.isSign) {
          this.$router.push({ name: routerName });
        } else {
          this.getUrl();
        }
      } else {
        this.$router.push({ name: routerName });
      }
    },
    getUrl() {
      this.$ajax
        .post(this.$api.getUrl)
        .then(res => {
          window.location.href = res.url;
        })
        .catch(err => {
          this.$message.error(err);
        });
    },
    getInfo() {
      this.$ajax
        .post(this.$api.getPerson)
        .then(res => {
          if (res.is_sign === 0) {
            this.$store.dispatch("changeSignStatus", false);
          } else if (res.is_sign === 1) {
            this.$store.dispatch("changeSignStatus", true);
          } else {
            this.$store.dispatch("changeSignStatus", false);
          }
          if (res.isPayPwd === "NO") {
            this.$store.dispatch("changeHadPayPsw", false);
          } else {
            this.data[1].button = "修改支付密码";
            this.$store.dispatch("changeHadPayPsw", true);
          }
        })
        .catch(err => {
          this.$message.error(err);
        });
    }
  },
  computed: {
    isSign() {
      return this.$store.state.isSign;
    }
  },
  created() {
    this.getInfo();
    if (this.$route.query.refresh) {
      window.location.href = process.env.VUE_APP_URL + "#/index/company/person";
    }
  }
};
</script>

<style scoped lang="less">
.personIndex {
  ul {
    white-space: nowrap;
    .person-wrapper {
      line-height: 6.125rem;
      .flex_content();
      .title {
        width: 14.5rem;
        font-size: 1rem;
        letter-spacing: 0.1rem;
        color: rgba(35, 35, 35, 1);
      }
      .des {
        .flex_one();
        font-size: 1rem;
        color: rgba(104, 104, 104, 1);
      }
    }
  }
}
</style>
